<template>
    <view class="wrap">
        <view class="text-area">
            <u-input
                v-model="signature"
                placeholder="给自己添加一条有趣的签名吧"
                :clearable="clearable"
                placeholder-style="color:#e9ebed"
                :custom-style="customStyle"
                :type="type"
                :height="height"
                auto-height="true"
            />
        </view>
        <view class="save" @click="save">保存</view>
    </view>
</template>
<script>
import { editSignature } from '@/api/mine.js';
export default {
    name: '',
    data() {
        return {
            clearable: true,
            signature: '',
            type: 'textarea',
            border: true,
            height: 320,
            customStyle: {
                color: '#262832',
                fontSize: '30rpx',
                lineHeight: '40rpx'
            }
        };
    },

    computed: {},
    onLoad() {},
    onShow() {},
    methods: {
        async save() {
            if (!this.signature) {
                this.$showToast('请先编辑签名');
                return;
            }
            let result = await editSignature({ profile: this.signature });
            if (result && result.RequestStatus == 100) {
                this.$u.vuex('vuex_userSignature', this.signature);
                this.$u.route({
                    type: 'back'
                });
            }
        }
    },
    watch: {},
    components: {}
};
</script>
<style lang="scss" scoped>
.wrap {
    width: 100%;
    background: #f7f7f7;
    .text-area {
        padding: 40rpx 30rpx 20rpx;
        background: #fff;
        font-size: 30rpx;
        line-height: 40rpx;
    }
    .save {
        width: 600rpx;
        height: 86rpx;
        background-image: linear-gradient(45deg, #47c649 0%, #5ad25c 100%), linear-gradient(#08c160, #08c160);
        border-radius: 10rpx;
        margin: 300rpx auto;
        color: #ffffff;
        font-size: 30rpx;
        line-height: 86rpx;
        text-align: center;
    }
}
</style>
